<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>资金调拨</title>
    <!--导入layui包-->
    <link rel="stylesheet" href="../layui/css/layui.css"/>
    <script src="../jQuery/jquery-1.11.2.js"></script>
    <script src="../layui/layui.js"></script>
    <link rel="stylesheet" type="text/css" href="/css/font.css">
</head>
<body>
<blockquote class="layui-elem-quote news_search">
<!--数据表格-->
<table class="layui-hide" id="secStockTable" lay-filter="secStockList"></table>

<script type="text/html" id="secStock_search">
    <!--多条件查询层-->
    <div style="float: left">
        <form class="layui-form layui-col-md12 x-so">
            调拨类型：
            <div class="layui-input-inline">
                <select name="reType" id="reType">
                    <option value="">---请选择---</option>
                    <option value="现金利息">现金利息</option>
                    <option value="债券利息">债券利息</option>
                    <option value="申购款">申购款</option>
                    <option value="赎回款">赎回款</option>
                    <option value="认购款">认购款</option>
                    <option value="基金成立">基金成立</option>
                </select>
            </div>
            调拨方向：
            <div class="layui-input-inline">
                <select name="dial" id="dial">
                    <option value="">---请选择---</option>
                    <option value="1">流入</option>
                    <option value="-1">流出</option>
                </select>
            </div>
            <button id="search" class="layui-btn layui-btn-primary layui-bg-gray" lay-submit data-type="reload" lay-filter="provinceSearch">
                <i class="layui-icon">&#xe615;</i>
            </button>
        </form>
    </div>
    <!--多条件查询结束-->

    <!--头部工具栏-->
    <div class="layui-btn-container layui-input-inline" style="margin-left: 330px">
        <button class="layui-btn layui-btn-danger" lay-event="batchDel">
            <i class="layui-icon">&#xe640;</i>批量删除
        </button>
    </div>
</script>

<!-- 添加/修改界面开始 -->
<div id="data-main" style="display: none;">
    <div style="margin-left: 90px;margin-top: 20px">
        <form class="layui-form" id="secStockForm" method="post" lay-skin="line" lay-filter="secStockFormTest" >
            <div class="layui-form-item">
                <label class="layui-form-label" style="top: 5px">调拨编号</label>
                <div class="layui-input-inline" style="top: 5px">
                    <input name="tofId" lay-verify="required" placeholder="请输入调拨编号" autocomplete="off" class="layui-input"/>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label" style="top: -48px;right: -330px">基金编号</label>
                <div class="layui-input-inline" style="top: -48px;right: -330px">
                    <input type="text" name="fundId" lay-verify="required" placeholder="请输入基金编号" autocomplete="off" class="layui-input"/>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label" style="width: 250px;right: 170px;top: -40px">账户编号</label>
                <div class="layui-input-inline" style="right: 170px;top: -40px">
                    <input type="text" name="caId" lay-verify="required" placeholder="请输入账户编号" autocomplete="off" class="layui-input"/>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label" style="width: 250px;right: -160px;top: -90px">调拨类型</label>
                <div class="layui-input-inline">
                <div class="layui-input-block" name="" style="width: 190px;right: -50px;top: -90px">
                    <select name="reType" lay-verify="required">
                        <option value="0">--请选择--</option>
                        <option value="现金利息">现金利息</option>
                        <option value="债券利息">债券利息</option>
                        <option value="申购款">申购款</option>
                        <option value="赎回款">赎回款</option>
                        <option value="认购款">认购款</option>
                        <option value="基金成立">基金成立</option>
                    </select>
                </div>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label" style="width: 250px;right: 170px;top: -90px">调拨金额</label>
                <div class="layui-input-inline" style="right: 170px;top: -90px">
                    <input type="text" name="reMoney" lay-verify="required" placeholder="请输入调拨金额" autocomplete="off" class="layui-input"/>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label" style="width: 250px;right: -160px;top: -140px">业务日期</label>
                <div class="layui-input-inline" style="right: -160px;top: -140px">
                    <input type="date" name="businDate" lay-verify="required" placeholder="请输入业务日期" autocomplete="off" class="layui-input"/>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label" style="width: 250px;right: 170px;top: -140px">调拨日期</label>
                <div class="layui-input-inline" style="right: 170px;top: -140px">
                    <input type="date" name="reDate" lay-verify="required" placeholder="请输入调拨日期" autocomplete="off" class="layui-input"/>
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label" style="width: 250px;right: -160px;top: -190px">标记</label>
                <div class="layui-input-inline" style="right: -160px;top: -190px">
                    <input type="text" name="mark" lay-verify="required" placeholder="请输入标记" autocomplete="off" class="layui-input"/>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label" style="width: 250px;right: 170px;top: -190px">调拨方向</label>
                <div class="layui-input-inline">
                <div class="layui-input-block" style="width: 190px;right: 280px;top: -190px">
                    <select name="dial" lay-verify="required">
                        <option value="0">--请选择--</option>
                        <option value="1">流入</option>
                        <option value="2">流出</option>
                    </select>
                </div>
                </div>
            </div>
            <div class="layui-form-item" >
                <div class="layui-input-block" style="width: 250px;right: -120px;top: -170px">
                    <button class="layui-btn layui-bg-blue" lay-submit lay-filter="formSave">保存</button>
                    <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                </div>
            </div>
        </form>
    </div>
</div>
<!-- 添加/修改界面结束 -->

<!-- 行中操作按钮[仅对本行操作] -->
<script type="text/html" id="barDemo">
    <a class="layui-btn layui-btn-xs layui-btn-normal layui-icon layui-icon-edit" lay-event="update" style="display: none">修改</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs layui-icon layui-icon-delete" lay-event="delete">删除</a>
</script>

<!--脚本代码-->
<script type="text/javascript">
    layui.use(['table','layer','form','laypage','util','jquery'],function () {
        //导入模块并得到模块对象
        var table = layui.table,//表格对象
            layer = layui.layer,//弹层对象
            form = layui.form,//表单对象
            laypage = layui.laypage,//分页组件
            $ = layui.jquery,//jquery对象
            util = layui.util;//工具对象
        var valss="";
        var vals="";
        //渲染表格对象
        table.render({
            //id:"houseReload",//为多条件搜索重新加载使用
            elem: "#secStockTable",//表格对象
            url: "../fundAllocation/fund",//后台服务路径
            method: "GET",//提交方式
            height:740,
            toolbar: "#secStock_search",//表格上方普通工具栏
            //一页显示5条数据
            limit: 15,
            cols: [
                [
                    {checkbox: true},//开启多选框
                    {field: "tofId", title: "调拨编号", align: "center",width:180},
                    {field: "fundId", title: "基金名称", align: "center",width:180,templet:function (d) {
                            for (var i = 0; i <vals.length ; i++) {
                                if (vals[i].fundId==d.fundId){
                                    return vals[i].fundName;
                                }
                            }
                        }},
                    {field: "caId", title: "账户名称", align: "center",width:180,templet:function (d) {
                            for (var i = 0; i <valss.length ; i++) {
                                if (valss[i].caId==d.caId){
                                    return valss[i].accName;
                                }
                            }
                        }},
                    {field: "reType", title: "调拨类型", align: "center",width:180},
                    {field: "reMoney", title: "调拨金额(元)", align: "center",width:180,templet:function (d) {
                            if (d.reMoney.toString().indexOf(".")!=-1){
                                return d.reMoney.toLocaleString();
                            }else{
                                return (d.reMoney+ '').replace(/(\d{1,3})(?=(\d{3})+(?:$|\.))/g,'$1,')+".00";
                            }
                        }},
                    {field: "businDate", title: "业务日期",align:"center",
                        templet:function(d){return util.toDateString(d.businDate,"yyyy年MM月dd日")},width:180},
                    {field: "reDate", title: "调拨日期", align: "center",
                        templet:function(d){return util.toDateString(d.reDate,"yyyy年MM月dd日")},width:180},
                    {field: "mark", title: "标记", align: "center",width:180,templet:function (d) {
                            if (d.mark=="已处理"){
                                return "<span style='color: #06b535'>已处理</span>";
                            }else if (d.mark=="未处理"){
                                return "<span style='color: red'>未处理</span>";
                            }else{
                                return d.mark;
                            }
                        }},
                    {field: "dial", title: "调拨方向", align: "center",width:180,templet:function (a) {
                            if(a.dial==1){
                                return "<span style='color: #9BCA63;'>流入</span>";
                            }else if(a.dial==-1){
                                return "<span style='color: #FAD860;'>流出</span>";
                            }
                        }},
                    {fixed:"right",title:"操作",width:160,align:"center",toolbar:"#barDemo",width:180}
                ]
            ],
            page: true,
            //一页选择显示5或10条数据
            limits: [5, 10,20,30,50],
            parseData: function(data){ //将原始数据解析成 table 组件所规定的数据
                //$("#stockId").remove();
                vals=data.queryFundSetpT;
                valss=data.queryCashAccountT;
                /*var htmlVal="<option value=''>---请选择---</option>";
                //动态生成下拉框
                for (var i=0;i<vals.length;i++){
                    htmlVal+="<option value='"+vals[i].fundId+"'>"+vals[i].fundName+"</option>";
                }
                $("#stockId").append(htmlVal);*/
                return {
                    "code": data.code, //解析接口状态
                    "msg": data.msg, //解析提示文本
                    "count": data.count, //解析数据长度
                    "data": data.data //解析数据列表
                }}
        });


        //监听添加/修改页的提交操作[该表单的提交操作] [保存按钮]
        //定义页面操作方式
        var method="";
        form.on('submit(formSave)', function(data){
            //将表单中各字段值转换为json字符串
            var json=JSON.stringify(data.field);
            //ajax提交数据
            //使用ajax删除选中的
            $.ajax({
                type: method,//post提交方式
                url: "../fundAllocation/fundAllocation/",//后台Servlet路径
                data:JSON.stringify(data.field),
                dataType:"text",
                contentType:"application/json;charset=utf-8",//前端发送json字符串到后端，必需设置
                //提交成功后回调操作
                success: function(msg){
                    layer.closeAll();//关闭对话框
                    layer.msg(msg);//弹出提示框
                    table.reload('secStockTable');//刷新数据表格
                }
            });
            return false;
        });
        //表格头部工具栏事件代码，根据lay-event属性值判断执行相应的代码
        table.on('toolbar(secStockList)', function(obj) {
            //检查表格选择操作状态
            var checkStatus = table.checkStatus(obj.config.id);
            //判断事件event值
            switch(obj.event) {
                //批量删除操作：删除选定的多行数据
                case "batchDel":
                    //获得选中的表格行
                    var data = checkStatus.data;
                    //判断是否大于0行
                    if(data.length>0){
                        layer.confirm('请确认是否真的删除?', function(index){
                            //获取所有选择的id
                            var tofIdStr="";

                            for (var i = 0; i < data.length; i++) {
                                tofIdStr = tofIdStr+data[i].tofId+",";//累加字符
                            }
                            //去掉最后多余逗号
                            tofIdStr=tofIdStr.substring(0,tofIdStr.length-1);
                            layer.close(index);
                            //使用ajax删除选中的
                            $.ajax({
                                type: "put",//提交方式为put,替代delte请求
                                url: "/fundAllocation/batchDel?tofIdStr="+tofIdStr,//后台Servlet路径
                                success: function(msg){
                                    layer.msg('删除成功');
                                    //重新加载表格数据
                                    table.reload('secStockTable');
                                }
                            });
                        });
                    }else{
                        //没有选择数据行
                        layer.msg('你至少选一行！');
                    }
                    break;

            }
        });

        //监听表格行工具(操作)事件 [不能和前面写在一起，原因二者参数有区别：前者toolbar，这里为tool]
        table.on("tool(secStockList)",function (obj) {
            //得到表格行数据
            var data=obj.data;
            //判断事件event值，与lay-event属性比较(使用switch或if梯形结构都可以,前面已经用过switch,
            // 此处使用if梯形结构)
            //判断是否为行修改操作
            if(obj.event == "update"){
                //将设置请求方式为put
                method="put";
                //设置界面信息
                layer.open({
                    type: 1,
                    title:'<span style=\'color:white\' ><i class=\'layui-icon\'>&#xe6b2;</i> 修改资金调拨</span>',
                    area: ["60%","70%"],
                    shade: 0.4,
                    skin: 'layui-layer-lan',
                    content: $("#data-main").html()
                });
                //将当前行数据显示在表单各字段中
                form.val("secStockFormTest", {
                    "tofId": data.tofId,
                    "fundId":data.fundId,
                    "caId":data.caId,
                    "reType":data.reType,
                    "reMoney":data.reMoney,
                    "businDate":data.businDate,
                    "reDate":data.reDate,
                    "mark":data.mark,
                    "dial":data.dial
                });
                //将主键设置成只读:不允许修改
                $("input[name='tofId']").prop("readonly","readonly");
                //判断是否为行删除操作
            }else if(obj.event == "delete"){
                layer.confirm("真的删除编号为"+data.tofId+"这行数据吗?", function(index){
                    //执行表格中删除操作
                    obj.del();
                    layer.close(index);
                    $.ajax({
                        type: "delete",
                        url: "../fundAllocation/fund/"+data.tofId,//后台Servlet路径
                        data: "method=delete&tofId="+data.tofId,
                        success: function(msg){
                            //重新加载表格数据
                            //table.reload('');
                        }
                    });
                });
            }
        });

        //搜索表单中提交按钮的事件代码
        form.on("submit(provinceSearch)",function (data) {
            //定义表单数据对象
            var formData=data.field;
            //得到表单数据json字符串
            var json=JSON.stringify(data.field);
            //重新加载表格对象
            table.reload("secStockTable",{
                //页码
                page:{
                    curr:1
                },
                //条件数据，会带到后台
                where:{
                    reType:formData.reType,
                    dial:formData.dial
                }
            });
            return false;
        });


    });
</script>
</blockquote>
</body>
</html>